04. Design for Development: Kinnect

04. Design for Development: Kinnect
A collaboration by  Alika Geldenhuys, Trent Shippey and Zelien Zweers
Brief Summary 
A digital, game-based intervention was to be designed for this project that shows the powerful act of playing as a means to encourage meaningful connection. Students were divided into groups of 3 with a specific prompt assigned to each group. This digital intervention was designed for children between the ages of 6 and 8 and was aimed at encouraging connection among family, friends and/or the community.

Students were required to conduct research on their target audience and make use of prototyping to find out the likes and dislikes of the children in order to make accurate decisions for their digital intervention. This project aimed at creating positive change in a local context specifically with regard to civic responsibility and children’s development through play and experiential learning.
Project Deliverables
1. Process documentation including: 
  1.1 Initial research 
  1.2 Visual identity development
  1.3 Game development and prototyping
  1.4 Rationale
2. Tangible information solution (digital intervention)
Design Strategy 
The theme and focus of our app was sport or exercise, thus we chose to focus more on physical exercise rather than on a specific sport. We were also interested in physical exercises that can be beneficial to a child’s development and wanted to incorporate exercises that have been informed by research.

The app aids in fostering a connection between family and friends through having the parents as constant supervisors as well as having the “Join a League” function that promotes playing the games with friends. Through using the metaphor of superheroes as well as creating fantastical illustrations by combining mundane objects with mission scenarios such as climbing a couch mountain the app stimulates and enriches the imagination of children. The app is also useful for turning exercise into fun in the form of play, especially prescribed exercises that might feel like chores or homework. This in turn promotes activeness for everyone as it truly aims to include all children who are differently abled to be able to play along. Being able to link your account to your practitioners connects families with their practitioners much easier and vice versa.

Overall, Kinnect aims to promote connection through being active or “kinetic”. Children explore and get to know their world through play and Kinnect wants to promote this for all children from all backgrounds. 

To view our full research and process work document, click here.
Initial Research
Our target audience for Kinnect is primarily children in the 6-8 year old age group and secondarily their parents. We were presented with the problem statement of finding an engaging well-informed digital solution that aids in fostering a connection between children and parents with the overall theme of exercise. 

We were inspired by children creating their own worlds for free play. Superheroes have always been a popular theme with kids. They will often pretend to be their favourite characters or make up their own. This is something that Alika has seen a lot first-hand when she worked as a supervisor at aftercare for a year.

The concept for our digital intervention was to create an app that facilitates active games of dramatised play and free play. The play will be story-driven where children can adopt the personas of their favourite superheroes from the game or create their own with unique powers.

The app would encourage play at home with families, friends and at parties, as well as with teachers on the playground.

In the intervention, the child/parent will have a profile which will be linked to a practitioner's profile, most likely an occupational therapist, where they can upload and “prescribe” specific exercises and how they can be integrated into play.

There were two veins of research that we needed to pursue to create our intervention. The first was doing research with practitioners to gain a better understanding of the developmental needs of 6-8 years-olds and the second was through play testing and prototyping with 6-8 year-olds to see whether we were hitting the mark for our target market and if they found our intervention engaging.

We decided to reach out to practitioners and students in the field for them to shed some light on our process and help shape the direction in which our intervention would head.
During a workshop, we were tasked with creating a rough wireframe of our digital intervention. We decided to try and wireframe our superhero concept while fully embracing the play aspect of the project. We gathered lots of differently coloured lego “Duplo” blocks that we could use as a starting point for our wireframe.

Each colour block, on the makeshift “home screen” (Which itself was just a large lego block), represented potential user journeys. We placed the blocks on top of white paper which we could write on to gain a better understanding of the information architecture. By attaching blocks we could see how different journeys were linked. Working with lego to construct the wireframe made the concept feel very tangible and gave us a great birds-eye view of what we would like our intervention to do.

While this was by no means the final wireframe or concept we went with, it heavily influenced our methods going forwards in the project, which can be seen in the way we continued wireframing.
Findings
After conducting our initial research and engaging with the concept we decided that for our digital intervention we would create an app that allows practitioners to assign exercises to their patients that will help them with their development. The parent/guardian can create an account in the app and link their account to the account of the child’s practitioner. This way the practitioner can assign specific exercises to the child.

The next challenge was to try and think of a way to make these exercises fun and engaging. So we decided that the exercises will form a part of an obstacle course that has a narrative built around it. The idea behind this is that the practitioner would select the exercises that need to be done, and the app would create a unique narrative around it. The child would then be able to create their superhero and choose their powers, or select one of the superheroes already in the game and do the obstacle course/mission.

In creating these obstacle courses, we wanted them to be accessible to everyone regardless of what resources they have available to them. So the courses would be constructed and planned out by using everyday household objects.

While the assigned exercises are one of the main focuses of the app, we wanted it to be accessible for all, so if a child does not have a practitioner to assign them exercises they would still be able to play a variety of games that focus on physical development in a “Quick Play” section.

While this was the proposed gameplay and game mechanics, our user testing with the children helped shape how we would go about this.
Setting the Mood​​​​​​​
We leaned toward bright colours that don’t feel stagnant and simple shapes that are used to inform our designs to create our moodboard. The overall feeling we wanted the app to convey is friendliness, activeness and joy.
How Kinnect got it's name
The name Kinnect combines the three main concepts of the app namely, connection, being kinetic through exercise and “kin” which speaks to family.
Our Heroes Insignia
Initial Logo Exploration
Logo Refinement
Final Logo and Application
The logo needed to be dynamic and represent activeness and superheroes. The lighting bolt sign, which is also synonymous with kinetics and movement, was created by using the two N’s found in the name Kinnect. Complementary colours, blue and orange, were also used to add to the feeling of movement.
Punchy Colours and Powerful Letters
Our colour palette was inspired by the drawings that the children made. They leaned towards the bight colours such as green, blue and purple and used black to outline their drawings. We selected bright colours of each main colour group so that we had a lot of colours to work with to create dynamic and engaging illustrations.

Gotham Rounded in different weights was chosen as a clean and simple, yet friendly typeface to complement the illustrations in the app.
Heroes are born 
Hero and Villain Ideation
Initial Sketches
Our Heroes
And the Villains
The illustration style included a lot of texture and colour. We started by recreating pictures drawn by the children during our first playtest and developed them into a cohesive style. 

First, it was drawn out by hand and then digitised by using Procreate on an iPad.​​​​​​​
Home-made Obstacle Courses
By making use of a child’s imagination, you can turn any mundane objects into an obstacle course mission for “superheroes” to complete and develop their skills. Using things like tape, string, bundled-up socks and furniture. We visualised this through creative illustrations by combining imaginary, fantasy, and everyday mundane objects that families would find in their surroundings.
Earn Badges
For the game, we wanted there to be a feeling of making progress and earning something for the children so we created a badge system. Each of these was illustrated to look like a badge that can be sewn on. They have a fun and bright feeling and correlate to the achievements of the child. Such as the “New Bee” badge which is the first badge they earn and the “Fancy Flamingo” badge for achievements in balance.
Icons and Buttons
For our iconography style, we opted for a more simplistic approach, to have a balance between the UI and the textured background and illustrations. It also played a large role in the UX of the app, as the user will know what is ‘tappable’. The dark blue icon buttons indicate that they are inactive while the white ones represent active buttons.
​​​​​​​For our UX elements, we created big rounded buttons to make it child friendly and associate with our target audience’s age group, which was 6-8 year-olds. The home screen buttons included icons in the form of illustrations for better navigation.
Playtesting
We completed 3 playtest sessions at a primary school aftercare with 7-8 year old children. During the first playtest we asked the children to draw themselves as superheroes, after this playtest we realised that not all children liked to engage with creating a specific avatar and would rather select one that they can relate to the most. During the second playtest we set up an obstacle course for the children, after this, we discovered that children do not need a fully thought-out narrative to follow but will start creating their own through a prompt that is given. During the last playtest we showed the children parts of the final product and were pleasantly surprised by their positive reactions and intuitive use of the app.

For more detail on our playtests, research and insights, please see our research and process work document.
Final User Journey - Wireframes
To view the whole fully designed user journey in Figma, click here
See it in action
If you want to try out the prototype yourself, click here
04. Design for Development: Kinnect
Published: